<template>
	<view class="page">
		<u-list>
			<u-list-item>
				<view class="stock-info">
					<text class="stock-name">海天酱油</text>
					<text class="positive">{{ stock[0].profit > 0 ? '+' + stock[0].profit : stock[0].profit }}元</text>
				</view>
				<text class="date">{{ stock[0].date }}</text>
			</u-list-item>
		</u-list>

		<view class="empty-state">
			<u-icon name="empty" size="100" color="#ccc"></u-icon>
			<text class="empty-text">暂无记录</text>
		</view>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';

	export default {
		data() {
			return {
				stock: [{
					name: '海天酱油',
					profit: '1789',
					date: '2025-7-30 10:24'
				}]
			}
		},
		computed: {
			...mapState(['stockRecords'])
		},
		onShow() {
			console.log(this.stockList)
			this.loadStockRecords();
		},
		methods: {
			loadStockRecords() {
				// 从Vuex获取股票记录并计算盈利
				this.stockList = (this.stockRecords || []).map(record => {
					// 计算总买入金额
					const buyTotal = record.buys.reduce((sum, item) => {
						return sum + (Number(item.price) || 0) * (Number(item.quantity) || 0);
					}, 0);
					// 计算总卖出金额
					const sellTotal = record.sells.reduce((sum, item) => {
						return sum + (Number(item.price) || 0) * (Number(item.quantity) || 0);
					}, 0);
					// 计算盈利
					const profit = (sellTotal - buyTotal).toFixed(2);
					return {
						...record,
						profit
					};
				});
			},
			navigateToAdd() {
				uni.navigateTo({
					url: '/pages/record/edit/index'
				});
			},
			navigateToDetail(id) {
				uni.navigateTo({
					url: `/pages/record/detail/index?id=${id}`
				});
			}
		}
	};
</script>

<style scoped>
	.page {
		width: 100%;
		height: 100vh;
	}
</style>